<template>
  {{ currentDate }}
</template>

<script setup lang="ts">
import { ref, onBeforeUnmount, onMounted } from 'vue'
import { getTime } from '@/api/user'
import { setTimestampTime } from '@/utils/time'
import { Time } from '@/utils/serverTime'

import { useStore } from '@/stores/index'
const indexStore = useStore()

const currentDate = ref('')
let intervalId: any
let time: any
let num: number =  Math.floor(Date.now() / 1000)

onMounted(async () => {
  let res = await getTime({})
  Time.setGlobalTimeZoneName(indexStore.offset)
  num = res.data
})

// 三分钟重新请求一下时间
time = setInterval(async () => {
  let res = await getTime({})
  Time.setGlobalTimeZoneName(indexStore.offset)
  num = res.data ;
},1000 * 60 * 10)


currentDate.value = setTimestampTime(num)

intervalId = setInterval(() => {
  currentDate.value = setTimestampTime(num)
  num += 1
}, 1000)

onBeforeUnmount(() => {
  clearInterval(intervalId)
  clearInterval(time)
})
</script>
